<template>
	<view class="yzt-Iput">
		<input class="ipt" type="text" :placeholder="props.placeholder" v-model="iptVal" />
		<view class="btn" @click="fun(iptVal)"><slot></slot></view>
	</view>
</template>

<script is="ts" setup>
	import { ref , defineProps} from "vue";
	const iptVal = ref('');
	const props = defineProps({
		fun:{
			required:true,
			type:Function
		},
		placeholder:{
			type:String,
			default:'输入内容...'
		}
	});
</script>

<style lang="scss" scoped>
.yzt-Iput{
	display: flex;
	justify-content: space-between;
	.ipt{
		width: 80%;
		border: 1px solid $borColor;
		padding: 10rpx;
	}
	.btn{
		width: 30%;
		color: white;
		background-color: $borColor;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	.btn:active{
		filter: contrast(150%);
	}
}
</style>